import React from 'react';
import ChromeSlot from '@akinon/pz-theme/src/chrome/chrome-slot';
import { PLACEHOLDER_SLUGS } from '@akinon/pz-theme/src/chrome/placeholder-slugs';
import { LiveAccountOrderPageContext } from '@akinon/pz-theme/src/chrome/live-order-page-context';
import { buildAccountPageContext } from '@akinon/pz-theme/src/chrome/page-context';
import { auth } from 'auth';
import { ROUTES } from 'routes';

/**
 * Account order detail. Publishes the SAME `order` root as the success page,
 * so a composition authored on one resolves on the other. Scoped to its own
 * route group so a composed detail page cannot swallow the cancellation
 * screen under the same order segment.
 */
export default async function Layout({
  children,
  params
}: {
  children: React.ReactNode;
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  const session = await auth();

  return (
    <div>
      <LiveAccountOrderPageContext orderId={id}>
        <ChromeSlot
          slug={PLACEHOLDER_SLUGS.accountOrderDetail}
          fallback={children}
          pageContext={buildAccountPageContext({
            path: ROUTES.ACCOUNT_ORDERS,
            sessionUser: (session?.user as Record<string, unknown>) ?? null
          })}
        />
      </LiveAccountOrderPageContext>
    </div>
  );
}